<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>JavaScript-变量的定义规则(JavaScript-Variable-Definition-Rules)</title>
  <!-- 
  在 JavaScript 中，变量是存储数据的容器。了解变量的定义规则对于编写正确的代码至关重要。以下是 JavaScript 变量定义的主要规则和注意事项：

  1. 变量声明关键字
  -  `var` ：
    - 在 ES5 及之前的版本中使用。
    - 变量可以在函数内或全局作用域中声明。
    - 存在变量提升（hoisting）现象。
    
  -  `let` ：
    - 在 ES6 引入。
    - 变量作用域限于块级（block scope）。
    - 不存在变量提升。
    
  -  `const` ：
    - 在 ES6 引入。
    - 声明常量，值不可更改。
    - 也具有块级作用域。

  2. 变量命名规则
  - 合法字符：
    - 变量名可以包含字母、数字、下划线（_）和美元符号（$）。
    - 变量名不能以数字开头。
    
  - 大小写敏感：
    - JavaScript 变量名是大小写敏感的， `myVar`  和  `myvar`  是不同的变量。

  - 保留字：
    - 不能使用 JavaScript 的保留字（如  `if` 、 `for` 、 `function`  等）作为变量名。

  3. 变量命名约定
  - 驼峰命名法：
    - 推荐使用驼峰命名法（camelCase）来命名变量，例如  `myVariableName` 。

  - 常量命名：
    - 常量通常使用全大写字母，单词之间用下划线分隔，例如  `MAX_VALUE` 。

  4. 变量初始化
  - 声明与赋值：
    - 变量可以在声明时赋值，也可以在后续的代码中赋值。
  let x;          // 声明变量
  x = 10;        // 赋值
  let y = 20;    // 声明并赋值
  - 未赋值的变量：
    - 声明但未赋值的变量，其值为  `undefined` 。

  5. 变量提升
  - 概念：
    - 在 JavaScript 中，变量提升指的是变量声明被提升到函数或全局作用域的顶部。
    
  - 示例：
  console.log(a); // 输出: undefined
  var a = 5

  6. 作用域
  - 全局作用域：
    - 在全局环境中声明的变量可以在任何地方访问。

  - 函数作用域：
    - 使用  `var`  声明的变量在其所在的函数内部可访问。

  - 块级作用域：
    - 使用  `let`  和  `const`  声明的变量仅在其块（如  `if` 、 `for`  等）内部有效。

  总结
  - 变量声明使用  `var` 、 `let`  或  `const` 。
  - 变量名必须遵循合法字符、大小写敏感和保留字的规则。
  - 推荐使用驼峰命名法和全大写字母命名常量。
  - 理解变量提升和作用域的概念有助于编写更清晰的代码。

   -->
</head>
<body>

  <script>
    // 声明变量
    var x = 10;
    let y = 20;
    const z = 30;

    // 变量命名规则
    let $myVar = 5;
    let _myVar = 10;

    // 变量提升
    console.log(a); // 输出: undefined
    var a = 5;

    // 作用域
    {
      let blockVar = 100;
      console.log(blockVar); // 输出: 100
    }
    // console.log(blockVar); // 报错：blockVar is not defined

    // 常量
    const PI = 3.14159;
    // PI = 3.14; // 报错：Assignment to constant variable.

    // 变量类型
    let num = 10;
    let str = "Hello";
    let isTrue = true;
    let arr = [1, 2, 3];
    let obj = { name: "John", age: 30 };
    let func = function() { console.log("Hello, world!"); };

    // 输出变量类型
    console.log(typeof num); // 输出: number
    console.log(typeof str); // 输出: string
    console.log(typeof isTrue); // 输出: boolean
    console.log(typeof arr); // 输出: object
    console.log(typeof obj); // 输出: object

    // 函数
    function greet(name) {
      return "Hello, " + name + "!";
    }
    console.log(greet("Alice")); // 输出: Hello, Alice!

    // 条件语句
    let age = 18;
    if (age >= 18) {
      console.log("You are an adult.");
    } else {
      console.log("You are a minor.");
    }

    // 声明多个变量
    let name = "Alice", height = 1.25, isStudent = true;
    console.log(name, height, isStudent); // 输出: Alice 1.25 true
  </script>
  
</body>
</html>